<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="/css/960/reset.css" type="text/css" media="all" />
    <link rel="stylesheet" href="/css/960/text.css" type="text/css" media="all" />
    <link rel="stylesheet" href="/css/960/960_24_col.css" type="text/css" media="all" />
    <link rel="stylesheet" href="/css/pybb/base.css" type="text/css" media="all" charset="utf-8"/>
    <link rel="stylesheet" href="/css/default/nav.css" type="text/css" media="all" charset="utf-8"/>
    <title>{% block title %}forum{% endblock %}</title>
    <script type="text/javascript" language="javascript">
      function search_text_clear() {
        var original_text = "Search suburb, clubs or more...";
        var search_text = document.getElementById("search-text");
        if(original_text == search_text.value) {
          search_text.value = "";
        }
      }
      function search_text_setting() {
        var original_text = "Search suburb, clubs or more...";
        var search_text = document.getElementById("search-text");
        if(search_text.value == "") {
          search_text.value = original_text;
        }
      }
    </script>
</head>
<body>
<div id="header" class="container_24">
  <div class="title">
    <a href="/map/"><img src="/res/forum_v2/logo.png" /></a>
  </div>
  <div id="panel" class="panel">
    <div class="user-panel">
      <div class="panel-left"></div>
      <div id="welcome" class="panel-gray">
        {% if user.is_authenticated %}
        <p id="info" class="panel-margin">Welcome, <span>{{ user }}</span></p>
        <div id="operations" class="panel-margin">
          <span id="log-operation" class="operation">Logout</span>
        </div>
        {% else %}
        <div id="operations" class="panel-margin"><span class="operation">Login</span> or <span class="operation">Register</span></div>
        {% endif %}
      </div>
      <div class="panel-red"><p class="panel-margin"><a href="/">HOME</a></p></div>
      <div class="panel-right"></div>
      <div class="clear"></div>
    </div>
    <div class="clear"></div>
    <div id="search-bar">
      <div class="search-left"></div>
      <div id="search" class="search">
        <form action="" method="get">
          <input type="text" id="search-text" class="search-text" name="search" value="Search suburb, clubs or more..." onfocus="search_text_clear()" onblur="search_text_setting()"/>
          <input type="image" src="/res/forum_v2/search_button.png" class="search-button"/>
        </form>
      </div>
      <div class="search-right"></div>
    </div>
  </div>
</div>

<div class="container_24 page">
  <div class="container-top"></div>
  <div class="container-body">
    <div id="crumbs">
      {% block pybb_crumbs %}{% endblock %}
    </div>
    <div id="content">
      {% block pybb_content %}{% endblock %}
    </div>
  </div>
  <div class="container-bottom"></div>
</div>
<div id="glow"></div>
</body>
</html>
